<template>
  <div>
    <el-form @submit.native.prevent>
      <el-row :gutter="24">
        <el-col :span="9">
          <el-form-item>
            <div style="display: flex">
              <el-input
                v-model="text"
                prefix-icon="el-icon-search"
                placeholder="业务编号 / 收款状态 / 付款方 / 业务类型/ 品牌型号/ 车牌号"
                @keyup.enter.native="search()"
              >
              </el-input>
              <el-button type="primary" @click="search()">查询 </el-button>
            </div>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <el-table
      :data="tableData"
      style="width: 100%"
      border
      :header-cell-style="{ textAlign: 'center' }"
      :cell-style="{ textAlign: 'center' }"
      :multiple-sort="false"
      @sort-change="onSortChange"
    >
      <el-table-column
        prop="ywbh"
        label="业务编号"
        fixed
        sortable="custom"
        :sort-orders="['ascending', 'descending']"
      ></el-table-column>
      <el-table-column prop="ywlx" label="业务类型"></el-table-column>
      <el-table-column prop="ppxh" label="品牌型号"></el-table-column>
      <el-table-column prop="cph" label="车牌号"></el-table-column>
      <el-table-column prop="fkf" label="付款方"></el-table-column>
      <el-table-column
        prop="ysje"
        label="应收金额"
        sortable="custom"
        :sort-orders="['ascending', 'descending']"
      ></el-table-column>
      <el-table-column
        prop="ssje"
        label="实收金额"
        sortable="custom"
        :sort-orders="['ascending', 'descending']"
      ></el-table-column>
      <el-table-column prop="skzt" label="收款状态"></el-table-column>
      <el-table-column prop="kpzt" label="开票状态"></el-table-column>
      <el-table-column prop="djr" label="对接人"></el-table-column>
      <el-table-column
        prop="createTime"
        label="创建时间"
        sortable="custom"
        :sort-orders="['ascending', 'descending']"
      ></el-table-column>
      <el-table-column label="操作" fixed="right" width="120px">
        <template slot-scope="scope">
          <el-button type="text" @click="edit(scope.row)">编辑</el-button>
          <el-button type="text" style="color: red" @click="del(scope.row.id)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <!--分页-->
    <el-pagination
      :page-sizes="[5, 10, 20, 50, 100]"
      :page-size="size"
      :current-page="current"
      :total="total"
      @current-change="currentChange"
      @size-change="sizeChange"
      layout="total, sizes, prev, pager, next, jumper"
    >
    </el-pagination>

    <Edit
      v-if="isShowEdit"
      :isShowEdit="isShowEdit"
      :record="formFileds"
      @getList="getList"
      @dialogClose="dialogClose"
    >
    </Edit>
  </div>
</template>

<script>
import Edit from "./financeEdit.vue";
import {
  selectAll,
  find,
  deleteByid,
  sort,
  ipage,
} from "@/api/evaluation/financeList";
export default {
  components: {
    Edit,
  },
  data() {
    return {
      text: "",
      size: 10,
      current: 1,
      total: 0,
      pprop: "ywbh",
      sortType: 0,
      formFileds: {},
      editForm: {},
      tableData: [],
      options1: [],
      options2: [],
      isShowEdit: false,
      Selection: [],
    };
  },
  methods: {
    search() {
      this.getList();
      //find("input=" + this.text).then((res) => {
      //  this.tableData = res.data;
      //});
    },
    currentChange(e) {
      this.current = e;
      this.getList();
    },
    sizeChange(e) {
      this.size = e;
      this.getList();
    },
    dialogClose() {
      this.isShowEdit = false;
    },
    edit(row) {
      this.isShowEdit = true;
      this.formFileds = row;
    },
    del(id) {
      this.$confirm("确定要删除当前行吗？", "删除", {
        comfirmButtonText: "确定",
        cancelButtonText: "取消",
      }).then(() => {
        deleteByid("id=" + id).then((res) => {
          if (res) {
            this.$message.success("删除成功！");
            this.getList();
          }
        });
      });
    },
    getList() {
      var par;
      par = {
        size: this.size,
        current: this.current,
        order: this.sortType,
        prop: this.pprop,
        qyid: Number(localStorage.getItem("companyId")),
      };
      if (this.text) {
        par.input = this.text;
      }
      ////console.log("未点击：column____________", this.text);
      ipage(par).then((res) => {
        if (res) {
          this.tableData = res.data.records;
          this.total = res.data.total;
        }
        ////////////////////  /* this.tableData = res.data; */
      });
      //selectAll().then((res) => {
      //  this.tableData = res.data;
      //});
    },
    onSortChange(column) {
      this.text = "";
      this.sortType =
        column.order === "ascending"
          ? 1
          : column.order === "descending"
          ? 0
          : 0; //将sortType设置为与后端约定的排序值，1为升序，0为降序，null为默认不排序
      this.pprop = column.prop === "createTime" ? "create_time" : column.prop;
      //console.log("已经点击：column____________", column);
      this.getList();
      //sort("order=" + this.sortType + "&prop=" + this.pprop).then((res) => {
      //  this.tableData = res.data;
      //  this.total = res.data.length;
      //});
    },
  },
  mounted() {
    this.getList();
  },
};
</script>

<style lang="less" scoped>
:deep .el-form-item__label {
  position: relative;
  display: inline-block;
  text-align-last: justify;
}
</style>